<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>涛宝商城-管理中心</title>
		<link rel="stylesheet" type="text/css" th:href="@{appstyle/css/mdui.min.css}" />
		<link rel="stylesheet" type="text/css" th:href="@{appstyle/css/github-gist.css}" />
		<link rel="stylesheet" type="text/css" th:href="@{appstyle/css/railscasts.css}" />
		<link rel="stylesheet" type="text/css" th:href="@{appstyle/css/docs.css}" />
		<link rel="stylesheet" type="text/css" th:href="@{appstyle/css/bootstrap.min.css}" />
		<link rel="stylesheet" type="text/css" th:href="@{appstyle/css/bootstrap-table.min.css}" />
		
		<script th:src="@{appstyle/js/jquery-3.3.1.js}" type="text/javascript" charset="utf-8"></script>
		<script th:src="@{appstyle/js/bootstrap.min.js}" type="text/javascript" charset="utf-8"></script>
		<script th:src="@{appstyle/js/bootstrap-table.min.js}" type="text/javascript" charset="utf-8"></script>
		<script th:src="@{appstyle/js/bootstrap-table-zh-CN.min.js}" type="text/javascript" charset="utf-8"></script>
		
		<script th:src="@{appstyle/js/vue.js}" type="text/javascript" charset="utf-8"></script>
		
		<link rel="stylesheet" type="text/css" th:href="@{appstyle/css/summernote.css}"/>
		<script th:src="@{appstyle/js/summernote.min.js}" type="text/javascript" charset="utf-8"></script>
		<script th:src="@{appstyle/js/summernote-zh-CN.js}" type="text/javascript" charset="utf-8"></script>
	</head>
	<body class="mdui-drawer-body-left mdui-appbar-with-toolbar mdui-theme-primary-indigo mdui-theme-accent-pink mdui-loaded">
		<div id="vue-divdisplay">
		<header class="mdui-appbar mdui-appbar-fixed" mdui-headroom>
			<div class="mdui-toolbar mdui-color-theme">
				<span class="mdui-btn mdui-btn-icon mdui-ripple mdui-ripple-white" mdui-drawer="{target: &#39;#main-drawer&#39;, swipe: true}"><i
					 class="mdui-icon material-icons">menu</i></span>
				<a href="https://www.mdui.org/" class="mdui-typo-headline mdui-hidden-xs" style="position: relative;left: 600px;">涛宝商城-管理中心</a>
				<div class="mdui-toolbar-spacer"></div>
			</div>
		</header>

		<div class="mdui-drawer" id="main-drawer">
			<div class="mdui-list" mdui-collapse="{accordion: true}" style="margin-bottom: 76px;">
				<div class="mdui-collapse-item mdui-collapse-item-open">
					<div class="mdui-collapse-item-header mdui-list-item mdui-ripple">
						<i class="mdui-icon material-icons">&#xe84f;</i>
						<div class="mdui-list-item-content" @click="divdisplay=0">Page Home</div>
						<i class="mdui-collapse-item-arrow mdui-icon material-icons">keyboard_arrow_down</i>
					</div>
				</div>


				<div class="mdui-collapse-item">
					<div class="mdui-collapse-item-header mdui-list-item mdui-ripple">
						<i class="mdui-icon material-icons">&#xe3ae;</i>
						<div class="mdui-list-item-content">商品管理</div>
						<i class="mdui-collapse-item-arrow mdui-icon material-icons">keyboard_arrow_down</i>
					</div>
					<div class="mdui-collapse-item-body mdui-list">
						<a href="#" class="mdui-list-item mdui-ripple " @click="divdisplay=1">商品管理</a>
						<a href="#" class="mdui-list-item mdui-ripple " @click="divdisplay=2">品类管理</a>
					</div>
				</div>
				
				<div class="mdui-collapse-item">
					<div class="mdui-collapse-item-header mdui-list-item mdui-ripple">
						<i class="mdui-icon material-icons">&#xe85d;</i>
						<div class="mdui-list-item-content">订单</div>、
						<i class="mdui-collapse-item-arrow mdui-icon material-icons">keyboard_arrow_down</i>
					</div>
					<div class="mdui-collapse-item-body mdui-list">
						<a href="#" class="mdui-list-item mdui-ripple " @click="divdisplay=3">订单管理</a>
					</div>
				</div>
			</div>
		</div>

		<a id="anchor-top"></a>
		<div>
			<div id="div0" v-show="divdisplay==0">
				<div class="mdui-container">
				  <div class="mdui-typo">
				    <blockquote>
				      <p>无论走到哪里，都应该记住，过去都是假的，回忆是一条没有尽头的路，一切以往的春天都不复存在，就连那最坚韧而又狂乱的爱情归根结底也不过是一种转瞬即逝的现实。</p>
				      <footer>马尔克斯 ——《百年孤独》</footer>
				    </blockquote>
				    <blockquote>
				      <p>涛宝商城,只有想不到,没有买不到!</p>
				      <footer>A205第一小组</footer>
				    </blockquote>
				    <blockquote>
				      <p>[商城公告:出现问题请反馈给QQ253163993/微信snkkka25316399377]</p>
				      <footer><a href="tencent://Message/?Uin=2531639937&amp;websiteName=q-zone.qq.com&amp;Menu=yes">点击联系</a><i class="mdui-icon material-icons">&#xe325;</i></footer>
				    </blockquote>
				  </div>
				  </div>
			</div>
			<div id="div1"  v-show="divdisplay==1">
				<div class="mdui-typo-display-1-opacity">商品管理</div>
				<div class="mdui-divider"></div>
				<div class="mdui-container">
				<br><br>
				<div id="toolbar" class="btn-group">
            <button id="btn_edit" type="button" class="btn btn-default">
                <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>修改
            </button>
            <button id="btn_delete" type="button" class="deleteBtn btn btn-default">
                <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>删除
            </button>
						<select class="mdui-select" id="select-where" mdui-select style="position: relative;right:70px">
							<option value="1">根据商品id查询</option>
							<option value="2">根据商品名称查询</option>
						</select>
						<input type="text" id="input_text_serach" class="form-control" style="position: absolute;left:330px;top:0px" placeholder="关键词" />
						<button id="btn_serach" type="button"
							class="serachBtn btn btn-default" style="position: relative;left:540px">
							<i class="mdui-icon material-icons">create</i>查询
						</button>
					</div> 
        <br>
		  <div class="mdui-table-fluid">
		    <table class="mdui-table mdui-table-selectable" id="Datatable1">
		      <thead>
		      <tr>
		        <th>商品id</th>
		        <th class="mdui-table-col-numeric">商品名称</th>
		        <th class="mdui-table-col-numeric">商品分类</th>
		        <th class="mdui-table-col-numeric">商品库存</th>
		        <th class="mdui-table-col-numeric">商品创建日期</th>
		        <th class="mdui-table-col-numeric">商品状态</th>
		      </tr>
		      </thead>
		      <tbody id="Datatable1Tbody">
		      <tr>
		        <td>1</td>
		        <td>Data</td>
		        <td>Data</td>
		        <td>Data</td>
		        <td>Data</td>
		        <td>Data</td>
		      </tr>
		      <tr><td>5</td><td>Data</td><td>Data</td><td>Data</td><td>Data</td><td>Data</td></tr>
		      </tbody>
							<tfoot>
								<td colspan="7">
								<center>
								<nav aria-label="Page navigation">
									<ul class="pagination" id="pageOption">
										<li id="PreviousPage"><a href="#" aria-label="Previous" id="PreviousPageA"><span aria-hidden="true">&laquo;</span></a></li>
										
										<li id="NextPage"><a href="#" aria-label="Next" id="NextPageA"> <span aria-hidden="true" >&raquo;</span></a></li>
									</ul>
								</nav>
								</center>
								</td>
							</tfoot>
						</table>
		  </div>
		  <div class="mdui-panel" id="panel" mdui-panel>
		  <div class="mdui-panel-item" id="item-1">
    <div class="mdui-panel-item-header">
      <div class="mdui-panel-item-title">新增商品功能(点击我)</div>
      <div class="mdui-panel-item-summary">End date: Not set</div>
      <i class="mdui-panel-item-arrow mdui-icon material-icons">keyboard_arrow_down</i>
    </div>
    <div class="mdui-panel-item-body">
      <p>
      所属分类:
    <select  id="parent_category">
			<option value="0">选择您的分类</option>
	</select>  
	<select id="product_category">
			<option value="1">根据商品id查询</option>
	</select>  
      </p>
      <p>
<div class="mdui-textfield mdui-textfield-floating-label">
  <label class="mdui-textfield-label">商品名称(标题)</label>
  <input id="product_name" class="mdui-textfield-input" type="text"/>
</div>
</p>
      <p>
<div class="mdui-textfield mdui-textfield-floating-label">
  <label class="mdui-textfield-label">商品副标题</label>
  <input id="product_subtitle" class="mdui-textfield-input" type="text"/>
</div>
</p>
      <p>
<div class="mdui-textfield mdui-textfield-floating-label">
  <label class="mdui-textfield-label">商品单价</label>
  <input id="product_price" class="mdui-textfield-input" type="text"/>
</div>
</p>
      <p>
      <div class="mdui-textfield mdui-textfield-floating-label">
  <label class="mdui-textfield-label">商品库存</label>
  <input id="product_stock" class="mdui-textfield-input" type="text"/>
</div></p>
      <p>
      <h1>商品详情(上传的第一张图片作为主图)</h1>
<div style="margin-left: 20%;width: 500px;height: 200px;">
		       <div id="summernote"></div>
		    </div>
		    <br /><br /><br /><br /><br /><br /><br /><br /><br />
		    <div style="margin-left: 20%;width: 800px;height: 400px;">
		       <button id="btn1">显示书写的内容</button><br /><br />
		       <div id="html" style="width: 800px;height: 300px;background-color: lavender;border: 1px solid;"></div>
		    </div>
</p>
<script>
		    $(document).ready(function() {
		        //jquery创建一个summernote实例
		        var summernoteImgList = "";
		        $('#summernote').summernote({
		             //功能图标改为中文
		             lang: 'zh-CN',
		             //预设内容
		             placeholder: '请在此输入内容...',
		             height: 300,
		             width:800,
		             //回调函数
		             callbacks: {
		                   //初始化
		                  onInit: function() {
		                      //init
		                  },
		                  //焦点
		                  onFocus: function() {
		                      //focus
		                  },
		                  //图片文件上传
		                  onImageUpload: function(files, editor, $editable) {
		                      data = new FormData();  
		                      data.append("pic", files[0]);  
		                    $.ajax({  
		                        data : data,  
		                        type : "POST",  
		                        url : "fileupload",   
		                        cache : false,  
		                        contentType : false,  
		                        processData : false,  
		                        dataType : "text",  
		                        success: function(data) {  
		                            //[服务器所在文件所在目录位置]一般为"http://119.23.216.181/RoboBlogs/Upload_File/default_show.png"
		                            alert(data)
		                            $('#summernote').summernote('insertImage', data);
		                            summernoteImgList = summernoteImgList + data + ",";
		                        },  
		                        error:function(){  
		                            alert("上传失败");  
		                        }  
		                    });  
		                  }
		                }
		             
		        });
		        $("#save_Btn").click(function(){
		        	var categoryId = $("#product_category").val();
		        	// 如果分类不合法则获取根节点
		        	if($("#product_category").val()<10000){
		        		categoryId = $("#parent_category").val();
		        	}
		             var detailHtml=$("#summernote").summernote("code");
		             $("div#html").html(detailHtml);
		             $.ajax({
		            	 url:"manage/product/save_product.do",
		            	 Type:"post",
		            	 data:{
		            		 categoryId:categoryId,
		            		 name:$("#product_name").val(),
		            		 subtitle:$("#product_subtitle").val(),
		            		 price:$("#product_price").val(),
		            		 stock:$("#product_stock").val(),
		            		 subImages:summernoteImgList,
		            		 detail:detailHtml,
		            	 },
		            	 dataType:"json",
		            	 success:function(data){
		            		 alert(data.msg);
		            	 }
		             })
		        });
		    }); 
		  </script>
      <div class="mdui-panel-item-actions">
        <button id="cancel_Btn" class="mdui-btn mdui-ripple" mdui-panel-item-close>cancel</button>
        <button id="save_Btn" class="mdui-btn mdui-ripple" mdui-tooltip="{content: '提交记录'}">save</button>
      </div>
    </div>
    </div>
  </div>
		</div>
			</div>
			<div id="div2"  v-show="divdisplay==2">
					      <div class="mdui-container">
				<div class="mdui-typo-display-1-opacity">分类管理</div>
				<div class="mdui-divider"></div>
				<table class="mdui-table mdui-table-col-numeric" id="categoryTable">
		      <thead>
		      <tr>
		        <th>分类ID</th>
		        <th>分类名称</th>
		        <th>操作</th>
		      </tr>
		      </thead>
		      <tbody id="categoryTbody">
		      </tbody>
		      </table>
    <div class="mdui-panel" mdui-panel>
    <div class="mdui-panel-item">
      <div class="mdui-panel-item-header">
        <div class="mdui-panel-item-title">Trip name</div>
        <div class="mdui-panel-item-summary">Carribean cruise</div>
        <i class="mdui-panel-item-arrow mdui-icon material-icons">keyboard_arrow_down</i>
      </div>
      <div class="mdui-panel-item-body">
        <p>
        <h3>上传根节点</h3>
  <div class="mdui-textfield mdui-textfield-floating-label">
  <label class="mdui-textfield-label">节点名称</label>
  <input id="product_stock1" class="mdui-textfield-input" type="text"/>
  <button class="mdui-btn mdui-btn-raised mdui-ripple mdui-color-theme-accent" id="submitparentNode" onclick="nodeUpload(0)">提交根节点</button>
</div>
</p>
        <h3>上传子节点</h3>
  <div class="mdui-textfield mdui-textfield-floating-label">
  <label class="mdui-textfield-label">节点名称</label>
  <input id="product_stock2" class="mdui-textfield-input" type="text"/>
  <select id="selectnode">
  <option>请选择节点</option>
  </select>
  <button class="mdui-btn mdui-btn-raised mdui-ripple mdui-color-theme-accent" id="submitchildNode" onclick="nodeUpload(1)">提交子节点</button>
</div>
</p>

      </div>
    </div>
    </div>
    </div>
		      <script type="text/javascript">
		        $.ajax({
		        	url:"manage/category/listCategory.do",
		        	Type:"post",
		        	dataType:"json",
		        	success:function(data){
		        		$("#categoryTbody").empty();
		        		for(var i=0;i<data.data.length;i++){
		        			$("#selectnode").append("<option value="+data.data[i].id+">"+data.data[i].name+"</option>");
		        		}
		        	}
		        })
		         $.ajax({
		        	url:"manage/category/listCategory.do",
		        	Type:"post",
		        	dataType:"json",
		        	async:true,
		        	success:function(data){
		        		$("#categoryTbody").empty();
		        		for(var i=0;i<data.data.length;i++){
		        			var nodeMsg = "";
		        			var nodeMsgSelect="<button type='button' class='btn btn-xs btn-warning opear' data-toggle='dropdown' aria-haspopup='true' aria-expanded='false'> 查看子节点(包含本身)<span class='caret'></span></button><ul class='dropdown-menu'>";
		        			$.ajax({
		        				url:"manage/category/getCategoryAndDeepChildrenCategory.do",
		        				Type:"post",
		        				async:false,
		        				data:"categoryId="+data.data[i].id,
		        				dataType:"json",
		        				success:function(nodeData){
		        					for(var j=0;j<nodeData.data.length;j++){
		        						nodeMsgSelect = nodeMsgSelect + "<li><a href='#'>"+nodeData.data[j]+"</a></li>";
		        					}
		        				}
		        			})
		        			nodeMsgSelect = nodeMsgSelect + "</ul></div>";
		        			if(data.data[i].parentId == 0){
		        				nodeMsg = "<button type='button' id='nodeMsg' class='btn btn-xs btn-success opear' >根节点</button>";
		        			}else{
		        				nodeMsg = "<button type='button' id='nodeMsg' class='btn btn-xs btn-info opear' >非根节点</button>";
		        			}
		        			$("#categoryTbody").append("<tr><td>"+data.data[i].id+"</td><td>"+data.data[i].name+"</td><td>"+nodeMsg+nodeMsgSelect+"</td></tr>");
		        		}
		        	}
		        })
		        //新增节点
		        nodeUpload=function(num){
		        	// 上传根节点
		        	if(num==0){
			        	$.ajax({
			        		url:"manage/category/addCategory.do",
			        		Type:"post",
			        		data:{
			        			categoryName:$("#product_stock1").val(),
			        		},
			        		dataType:"json",
			        		success:function(data){
			        			if(data.status==0){
			        				location.href="admin.html";
			        			}
			        		}
			        	});
		        	}
		        	if(num==1){
			        	$.ajax({
			        		url:"manage/category/addCategory.do",
			        		Type:"post",
			        		data:{
			        			categoryName:$("#product_stock2").val(),
			        			productId:$("#selectnode").val(),
			        		},
			        		dataType:"json",
			        		success:function(data){
			        			if(data.status==0){
			        				location.href="admin.html";
			        			}
			        		}
			        	});
		        	}
		        }
		      </script>
			</div>
			<div id="div3"  v-show="divdisplay==3">
				<div class="mdui-container">
				<div class="mdui-typo-display-1-opacity">订单管理</div>
				<div class="mdui-divider"></div>
					<table class="mdui-table mdui-table-selectable" id="OrderDataTable">
						<thead>
							<tr><th class="mdui-table-col-numeric">订单号</th><th class="mdui-table-col-numeric">发货人(预留字段)</th><th class="mdui-table-col-numeric">收货人</th><th class="mdui-table-col-numeric">收货地址</th><th class="mdui-table-col-numeric">订单总价</th><th class="mdui-table-col-numeric">订单状态</th></tr>
						</thead>
						<tbody id="OrderDataTableBody">
							<tr><td>Data</td><td>Data</td><td>Data</td><td>Data</td><td>Data</td><td>已付款<button type="button" class="btn btn-xs btn-success">发货</button><button type="button" class="btn btn-xs btn-danger">删除订单</button></td></tr>
							<tr>
								<td>Data</td>
								<td>Data</td>
								<td>Data</td>
								<td>Data</td>
								<td>Data</td>
								<td>已付款<button type="button" class="btn btn-xs btn-success">发货</button><button type="button" class="btn btn-xs btn-danger">删除订单</button></td>
							</tr>
							<tfoot>
								<td colspan="7">
								<center>
								<nav aria-label="Page navigation">
									<ul class="pagination" id="orderPageOption">
										<li id="orderPreviousPage"><a href="#" aria-label="Previous" id="PreviousPageB"><span aria-hidden="true">&laquo;</span></a></li>
										
										<li id="orderNextPage"><a href="#" aria-label="Next" id="NextPageB"> <span aria-hidden="true" >&raquo;</span></a></li>
									</ul>
								</nav>
								</center>
								</td>
							</tfoot>
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</div>
	
			<script th:src="@{appstyle/js/app.js}" type="text/javascript" charset="utf-8"></script>
			<script type="text/javascript" th:src="@{appstyle/js/mdui.min.js}"></script>
			<script type="text/javascript"> 
			$(document).ready(function(){
				// =======================================订单模块=======================================
				initOrderMsg(1,10);
				
				
				// 订单发货
				orderGoods=function(orderOn){
					$.ajax({
						url:"manage/order/updateStatus.do",
						Type:"post",
						data:{
							orderOn:orderOn,
							statusCode:40,
						},
						dataType:"json",
						success:function(data){
							mdui.alert(data.msg);
							initOrderMsg(1,10);
						}
					})
				}
				
				
				// 订单取消
				orderCancel=function(orderOn){
					$.ajax({
						url:"manage/order/updateStatus.do",
						Type:"post",
						data:{
							orderOn:orderOn,
							statusCode:"0",
						},
						dataType:"json",
						success:function(data){
							mdui.alert(data.msg);
							initOrderMsg(1,10);
						}
					})
				}
				
				// 订单通知
				inform=function(code){
					if(code == 1){
						mdui.alert("涛宝快递正在光速派送中!");
					}
					if(code == 2){
						mdui.alert("提醒用户完毕!");
					}
				}
				
				function initOrderMsg(pageNum,pageSize){
					$.ajax({
						url:"manage/order/manageList.do",
						Type:"post",
						data:{
							pageNum:pageNum,
							pageSize:pageSize,
						},
						dataType:"json",
						success:function(data){
							$("#OrderDataTableBody").empty();
							$("#orderPageOption a:not('#PreviousPageB'):not('#NextPageB')").remove();
							for(var i=0;i<data.data.total;i++){
								var obj = data.data.list[i];
								var orderStatusCode = obj.status;
								var orderStatusDesc = "";
								if(orderStatusCode==0){
									orderStatusDesc = "<td>订单已取消</td>";
								}else if(orderStatusCode==10){
									orderStatusDesc = "<td>未付款<button type='button' class='btn btn-xs btn-success' onclick='inform(2)' >提醒付款</button><button type='button' class='btn btn-xs btn-danger' onclick='orderCancel("+obj.orderNo+")'>取消订单</button></td>";
								}else if(orderStatusCode==20){
									orderStatusDesc = "<td>已付款<button type='button' class='btn btn-xs btn-success' onclick='orderGoods("+obj.orderNo+")'>发货</button><button type='button' class='btn btn-xs btn-danger' onclick='orderCancel("+obj.orderNo+")'>取消订单</button></td>";
								}else if(orderStatusCode==40){
									orderStatusDesc = "<td>已发货<button type='button' class='btn btn-xs btn-success' onclick='inform(1)'>查看物流</button><button type='button' class='btn btn-xs btn-danger' onclick='orderCancel("+obj.orderNo+")'>取消订单</button></td>";
								}else if(orderStatusCode==50){
									orderStatusDesc = "<td>交易成功</td>";
								}else if(orderStatusCode==60){
									orderStatusDesc = "<td>交易关闭</td>";
								}
								$("#OrderDataTableBody").append("<tr><td>"+obj.orderNo+"</td><td>涛宝商城官方管理团队</td><td>"+obj.receiverVo.receiverName+"</td><td>"+obj.receiverVo.receiverProvince+"-"+obj.receiverVo.receiverCity+"</td><td>"+obj.payment+"</td>'"+orderStatusDesc+"'</tr>");
							}
							for(var j=data.data.pages;j>0;j--){
								$("#orderPreviousPage").after("<li><a href='#'>"+j+"</a></li>");
							}
							$("#orderPageOption a:not('#PreviousPageB'):not('#NextPageB')").click(function(){
								initOrderMsg($(this).text(),10);
							})
							mdui.updateTables();
						}
					})
				}
				
					
					
					
					
					
				// =======================================订单模块=======================================
				
				
				
				
				
				initCategoryMsg();
				//编辑按钮事件
				clickUpdate=function(productId){
					$.ajax({
						url:"manage/product/updateToPage.do",
						Type:"post",
						data:"productId="+productId,
						dataType:"json",
						success:function(data){
							if(data.status!=1){
								location.href="updateproduct.html";
							}
						}
					})
				}
				// 初始化分类信息
				function initCategoryMsg(){
					$.ajax({
						  url:"manage/category/listCategoryByParentId.do",
						  Type:"post",
						  data:"parent_id=0",
						  dataType:"json",
						  success:function(data){
							  $("#parent_category").empty();
							  for(var i=0;i<data.data.length;i++){
								  $("#parent_category").append("<option value="+data.data[i].id+">"+data.data[i].name+"</option>");
							  }
						  }
					  })
				}
				$("#parent_category").change(function(){
					$.ajax({
						  url:"manage/category/listCategoryByParentId.do",
						  Type:"post",
						  data:"parent_id="+$(this).children('option:selected').val(),
						  dataType:"json",
						  success:function(data){
							  $("#product_category").empty();
							  if(data.status==1){
								  $("#product_category").append("<option value='0'>没有找到对应数据,换个试试吧!</option>");
							  }
							  for(var i=0;i<data.data.length;i++){
								  $("#product_category").append("<option value="+data.data[i].id+">"+data.data[i].name+"</option>");
							  }
						  }
					  })
				})
				// 商品上下架通用方法
				Unshelves=function(type,id){
					$.ajax({
						 url:"manage/product/set_product_status.do",
						 Type:"post",
						 data:{
							 productId:id,
							 status:type,
						 },
						 dataType:"json",
						 success:function(data){
							 if(type==2){
								 mdui.snackbar({
									timeout:2000,
									message: '[温馨提醒:下架的商品是无法被前台搜索到的哦!]',
									position: 'top',
								});
							 }
							 // 刷新
							 ajaxPage(pageNum);
						 }
					 })
				}
				var pageNum = 1;
				ajaxPage(pageNum);
				// 初始化商品信息
				function ajaxPage(page){
					$.ajax({
						url:"manage/product/list.do",
						Type:"post",
						data:"pageNum="+page,
						dataType:"json",
						async:false,
						success:function(data){
							var getData = data.data.list;
							mdui.JQ("#Datatable1 tbody").empty();
							for(var i=0;i<getData.length;i++){
								// 判断这个商品不能是删除状态的
								var statusName = "";
								if(getData[i].status==1){
									statusName = "上架中<button type='button' id='ShelveBtn' class='btn btn-xs btn-warning opear' onclick='Unshelves(2,"+getData[i].id+")' >下架</button><button type='button' id='ShelveBtn' class='btn btn-xs btn-info opear' onclick='clickUpdate("+getData[i].id+")'>编辑</button>";
								}else if(getData[i].status==2){
									statusName = "已下架<button type='button' id='Unshelve' class='btn btn-xs btn-warning opear' onclick='Unshelves(1,"+getData[i].id+")' >上架</button><button type='button' id='ShelveBtn' class='btn btn-xs btn-info opear' onclick='clickUpdate("+getData[i].id+")'>编辑</button>";
								}
								mdui.JQ("#Datatable1 tbody").append("<tr><td>"+getData[i].id+"</td><td>"+getData[i].name+"</td><td>"+getData[i].categoryName+"</td><td>"+getData[i].stock+"</td><td>"+getData[i].createTime+"</td><td>"+statusName+"</td></tr>");	
							}
							mdui.updateTables();
							var pageBtns = $("#pageOption").find("li");
							for(var k=0;k<pageBtns.length;k++){
								if(k!=0 && k!=pageBtns.length-1){
									pageBtns.eq(k).remove();
								}
							}
							for(var j=data.data.pages;j>0;j--){
								$("#PreviousPage").after("<li><a href='#'>"+j+"</a></li>");
							}
							// 点击数字跳转指定
							$("#pageOption a:not('#PreviousPageA'):not('#NextPageA')").click(function(){
								ajaxPage($(this).text());
								pageNum = $(this).text();
							});
						}
					})
				}
				    //点击上一页:
					$("#PreviousPage").click(function(){
						if(pageNum <= 1){
							mdui.snackbar({
							    message: '已经到首页了',
							    position: 'top'
							  });
						}else{
							pageNum--;
							ajaxPage(pageNum);
						}
					});
					// 点击下一页
					$("#NextPage").click(function(){
						var pageCount = mdui.JQ(".pagination").find("li").length - 2;// 计算出页面数量
						if(pageNum >= pageCount){
							mdui.snackbar({
							    message: '已经是最大页数了!',
							    position: 'top'
							  });
						}else{
							pageNum++;
							ajaxPage(pageNum);
						}
					});
					// 删除商品
				$(".deleteBtn").click(function(){
					mdui.confirm('确定要删除这个商品吗?', function(){
						mdui.mutation();
						  var $items = $("#Datatable1").find("tr[class=mdui-table-row-selected]");
						 $items.each(function(){
							 $.ajax({
								 url:"manage/product/set_product_status.do",
								 Type:"post",
								 data:{
									 productId:$(this).find("td:eq(1)").text(),
									 status:3,
								 },
								 dataType:"json",
								 success:function(data){
									 // 删除后刷新
									 ajaxPage(pageNum);
								 }
							 })
						 })
					  });
				});
				// 按照指定格式搜索商品
				$("#btn_serach").click(function(){
					serachProduct($("#select-where").val(),$("#input_text_serach").val());
				})
				// 按照指定格式搜索商品方法:
			    function serachProduct(type,value){
					var serachType = "";
					var dataKey = "";
					if(value==""){
						ajaxPage(1);
						return;
					}
					if(type == 1){
						// 按照id查询
						serachType="manage/product/listByProductId.do";
						dataKey="productId";
					}
					if(type == 2){
						// 按照名称查询
						serachType="manage/product/listByProductName.do";
						dataKey="productName";
					}
			    	$.ajax({
						url:serachType,
						Type:"post",
						data:dataKey+"="+value,
						dataType:"json",
						async:false,
						success:function(data){
							var getData = data.data.list;
							mdui.JQ("#Datatable1 tbody").empty();
							for(var i=0;i<getData.length;i++){
								var statusName = "";
								if(getData[i].status==1){
									statusName = "上架中<button type='button' id='ShelveBtn' class='btn btn-xs btn-warning opear' onclick='Unshelves(2,"+getData[i].id+")' >下架</button><button type='button' id='ShelveBtn' class='btn btn-xs btn-info opear' onclick='clickUpdate("+getData[i].id+")'>编辑</button>";
								}else if(getData[i].status==2){
									statusName = "已下架<button type='button' id='Unshelve' class='btn btn-xs btn-warning opear' onclick='Unshelves(1,"+getData[i].id+")' >上架</button><button type='button' id='ShelveBtn' class='btn btn-xs btn-info opear' onclick='clickUpdate("+getData[i].id+")'>编辑</button>";
								}
								// 判断这个商品不能是删除状态的
								mdui.JQ("#Datatable1 tbody").append("<tr><td>"+getData[i].id+"</td><td>"+getData[i].name+"</td><td>"+getData[i].categoryName+"</td><td>"+getData[i].stock+"</td><td>"+getData[i].createTime+"</td><td>"+statusName+"</td></tr>");	
							}
							mdui.updateTables();
							var pageBtns = $("#pageOption").find("li");
							for(var k=0;k<pageBtns.length;k++){
								if(k!=0 && k!=pageBtns.length-1){
									pageBtns.eq(k).remove();
								}
							}
							for(var j=data.data.pages;j>0;j--){
								$("#PreviousPage").after("<li><a href='#'>"+j+"</a></li>");
							}
							// 点击数字跳转指定
							$("#pageOption a:not('#PreviousPageA'):not('#NextPageA')").click(function(){
								ajaxPage($(this).text());
								pageNum = $(this).text();
							})
						}
					})
				}
			})
			</script>
			
	</body>
</html>